<template>
    <div class="mall-layout mall-layout-home">
        <homeTop></homeTop>
        <div class="mall-layout-main">
            <div class="ant-spin-nested-loading">
                <div class="ant-spin-container">
                    <div class="confirm_order-confirm-page__PAhG7">
                        <div class="SubmitAddress_submit_addr__NQKkZ">
                            <div class="SubmitAddress_addr_left__l7qgs">
                                <i class="el-icon-location-outline" style="margin-right: 28px;"></i>
                                <div class="SubmitAddress_addr_info_comp__k17v1">
                                    <div class="SubmitAddress_account__KL7hv">{{placeshowdata.name}} {{placeshowdata.phone}}</div>
                                    <div class="SubmitAddress_addr__Mo6Ye">{{placeshowdata.detail}}</div>
                                </div>
                            </div>
                            <div class="SubmitAddress_addr_right__f1-op">
                                <el-button size="small" @click="replace">更换</el-button>
                                <el-button size="small" @click="editDialogVisible = true">新增</el-button>
                            </div>
                        </div>
                        <div class="ant-spin-nested-loading">
                            <div class="ant-spin-container">
                                <div class="confirm_goods-table-component__xVuWN confirm_table_component_m15__LbmRD" v-for="(item,index) in goodslist" :key="index" v-if="ordervalue == '保税'">
                                    <div class="ant-table">
                                        <div class="ant-table-title">
                                            <div class="confirm_header-component__prQfL">
                                                <div class="ant-space-align-center">
                                                    <div class="ant-space-item">
                                                        <span class="confirm_store-name__ZVLve">订单01</span>
                                                    </div>
                                                    <div class="ant-space-item-split">
                                                        <div class="ant-divider ant-divider-vertical"></div>
                                                    </div>
                                                    <div class="ant-space-item">
                                                        <span class="confirm_order-number__o2fkS">原始订单号：</span>
                                                    </div>
                                                </div>
                                                <div class="text-name">平台自营</div>
                                            </div>
                                        </div>
                                        <div class="ant-table-container">
                                            <el-table
                                                :data="tableData"
                                                style="width: 100%">
                                                <el-table-column
                                                    label="商品"
                                                    width="361.7">
                                                    <template slot-scope="scope">
                                                        <div class="confirm_goods-item-wrapper__DSo8">
                                                            <div class="ant-image">
                                                                <img style="width: 100%;height: 100%;" src="	https://static.xyb2b.com/images/ad2eac30728e16756b0e81ac544336d5.png" alt="">
                                                            </div>
                                                            <div class="confirm_goods-info__2vuNd">
                                                                <span class="confirm_title__8CPeb">法国 Lancome兰蔻 极光水小样 10ml</span>
                                                                <span class="confirm_goods_prop__bm349">10ml;24年01月01</span>
                                                                <span class="ant-tag">保税仓发</span>
                                                            </div>
                                                        </div>
                                                      </template>
</el-table-column>
<el-table-column prop="date" label="单价(税前)" width="91.19">
    <template slot-scope="scope">
        <div class="scope-item">
            <span>¥13</span>
        </div>
    </template>
</el-table-column>
<el-table-column prop="date" label="数量" width="88.53">
    <template slot-scope="scope">
        <div class="scope-item">
            <span>{{item.total_num}}</span>
        </div>
    </template>
</el-table-column>
<el-table-column prop="date" label="税费" width="113.45">
    <template slot-scope="scope">
        <div class="scope-item">
            <span>¥13</span>
        </div>
    </template>
</el-table-column>
<el-table-column prop="date" label="商品金额(含税费)" width="116.11">
    <template slot-scope="scope">
        <div class="scope-item">
            <span style="margin-right: 6px;">¥13</span>
            <el-tooltip class="item" effect="dark" placement="bottom">
                <img style="width: 16px;height: 16px;" alt="" src="https://static.xyb2b.com/images/58342d97065e3596850831891995f752.png">
                
                <div slot="content">1.跨境商品须根据支付金额收取跨境综合税上报海关；<br/>2.消费者支付金额，若达到海关规定的差异化税率，将导致税费变高；<br/>3.若(商品金额+优惠)÷ 数量 ≠ 单价，是因无法除尽，得出单价四舍五入后导致金额误差，并非计算错误。</div>
            </el-tooltip>
        </div>
    </template>
</el-table-column>
<el-table-column prop="date" label="商品运费" width="89.86">
    <template slot-scope="scope">
        <div class="scope-item">
            <span>¥{{item.express_price}}</span>
        </div>
    </template>
</el-table-column>
<el-table-column prop="date" label="优惠" width="89.86">
    <template slot-scope="scope">
        <div class="scope-item">
            <span>¥13</span>
        </div>
    </template>
</el-table-column>
<el-table-column prop="date" label="客户支付价(税后)" width="177">
    <template slot-scope="scope">
        <div class="scope-item">
            <span style="margin-right: 10px;">¥</span>
            <el-input></el-input>
        </div>
    </template>
</el-table-column>
<el-table-column prop="date" label="收益" width="110.3">
    <template slot-scope="scope">
        <div class="scope-item">
            <span>¥13</span>
        </div>
    </template>
</el-table-column>
</el-table>
</div>
<div class="ant-table-footer">
    <div class="confirm_footer-component__GqfXh">
        <div class="confirm_table_footer_price__Qnj8h">
            <div class="ant-space-item">
                <div class="small-box">
                    <div class="ant-images">
                        <el-tooltip class="item" effect="dark" content="订单合计金额=单价(税前)+税费+商品运费-优惠" placement="left">
                            <img src="https://static.xyb2b.com/images/58342d97065e3596850831891995f752.png" style="width: 100%;height: 100%;" alt="">
                        </el-tooltip>
                    </div>
                    <div class="Price_price-component__RzPDf">
                        <div class="ant-space-item">
                            <span class="Price_title-0__9N801">订单合计:</span>
                        </div>
                        <div class="ant-space-item">
                            <span class="confirm_price-count__fuGOm">¥{{item.total_pay_price}}</span>
                        </div>
                        <div class="ant-space-item">
                            <span style="color: rgb(153, 153, 153); font-size: 12px;">(含税费：¥1.18)</span>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
</div>
</div>
<div class="confirm_goods-table-component__xVuWN confirm_table_component_m15__LbmRD" v-for="(item,index) in goodslist" :key="index" v-if="ordervalue != '保税'">
    <div class="ant-table">
        <div class="ant-table-title">
            <div class="confirm_header-component__prQfL">
                <div class="ant-space-align-center">
                    <div class="ant-space-item">
                        <span class="confirm_store-name__ZVLve">订单01</span>
                    </div>
                    <div class="ant-space-item-split">
                        <div class="ant-divider ant-divider-vertical"></div>
                    </div>
                    <div class="ant-space-item">
                        <span class="confirm_order-number__o2fkS">原始订单号：</span>
                    </div>
                </div>
                <div class="text-name">平台商家
                    <img style="width: 6px;margin-left: 4px;cursor: pointer;" src="https://static.xyb2b.com/images/58e72e9e79276353c32a21187e7c131d.png" alt="">
                </div>
            </div>
        </div>
        <div class="ant-table-container">
            <el-table :data="tableData" style="width: 100%">
                <el-table-column label="商品" width="535.36">
                    <template slot-scope="scope">
                        <div class="confirm_goods-item-wrapper__DSo8">
                            <div class="ant-image">
                                <img style="width: 100%;height: 100%;" :src="item.big_img" alt="">
                            </div>
                            <div class="confirm_goods-info__2vuNd">
                                <span class="confirm_title__8CPeb">{{item.goods_name}}</span>
                                <span class="confirm_goods_prop__bm349">{{item.goods_sku.goods_attr}}</span>
                                <span class="ant-tag">保税仓发</span>
                            </div>
                        </div>
                      </template>
                </el-table-column>
                <el-table-column label="单价(税前)" width="133.83">
                    <template slot-scope="scope">
<div class="scope-item">
<span>¥</span>
</div>
</template>
                </el-table-column>
                <el-table-column label="数量" width="133.83">
                    <template slot-scope="scope">
<div class="scope-item">
<span>{{item.total_num}}</span>
</div>
</template>
                </el-table-column>
                <el-table-column label="商品金额(含税费)" width="167.3">
                    <template slot-scope="scope">
<div class="scope-item">
    <span style="margin-right: 6px;">¥</span>
    <el-tooltip class="item" effect="dark" placement="bottom">
        <img style="width: 16px;height: 16px;" src="https://static.xyb2b.com/images/58342d97065e3596850831891995f752.png">
        <div slot="content">1.跨境商品须根据支付金额收取跨境综合税上报海关；<br/>2.消费者支付金额，若达到海关规定的差异化税率，将导致税费变高；<br/>3.若(商品金额+优惠)÷ 数量 ≠ 单价，是因无法除尽，得出单价四舍五入后导致金额误差，并非计算错误。</div>
    </el-tooltip>
</div>
</template>
                </el-table-column>
                <el-table-column label="商品运费" width="133.83">
                    <template slot-scope="scope">
<div class="scope-item">
<span>¥{{item.express_price}}</span>
</div>
</template>
                </el-table-column>
                <el-table-column label="优惠" width="133.83">
                    <template slot-scope="scope">
<div class="scope-item">
<span>¥</span>
</div>
</template>
                </el-table-column>
            </el-table>
        </div>
        <div class="ant-table-footer">
            <div class="confirm_footer-component__GqfXh" style="display: flex;justify-content: space-between;">
                <div style="width: 260px;">
                    <el-input type="textarea" :rows="2" placeholder="请输入内容" v-model="remark[index]">
                    </el-input>
                </div>
                <div class="confirm_table_footer_price__Qnj8h">
                    <div class="ant-space-item">
                        <div class="small-box">
                            <div class="ant-images">
                                <el-tooltip class="item" effect="dark" content="订单合计金额=单价(税前)+税费+商品运费-优惠" placement="left">
                                    <img src="https://static.xyb2b.com/images/58342d97065e3596850831891995f752.png" style="width: 100%;height: 100%;" alt="">
                                </el-tooltip>
                            </div>
                            <div class="Price_price-component__RzPDf">
                                <div class="ant-space-item">
                                    <span class="Price_title-0__9N801">订单合计:</span>
                                </div>
                                <div class="ant-space-item">
                                    <span class="confirm_price-count__fuGOm">¥{{item.total_pay_price}}</span>
                                </div>
                                <!-- <div class="ant-space-item">
                                    <span style="color: rgb(153, 153, 153); font-size: 12px;">(含税费：¥1.18)</span>
                                </div> -->
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>


</div>
</div>
<div class="confirm_submit-footer__r5">
    <div class="confirm_submit_footer_hide__08sRD" v-show="smallshow">
        <div class="confirm_hide_content__bPyfY">
            <div class="confirm_total_count__XCqr7">
                <span class="confirm_total_title__fyXu4">总计</span> {{goodslist.length}}件商品
            </div>
            <div style="text-align: right;">
                <div class="confirm_each_item__3soZI">
                    <span style="text-align: right;">商品总额<span>(含税费:¥1.18)</span> :</span>
                    <span class="confirm_value__cg79b">¥{{orderprice}}</span>
                </div>
                <div class="confirm_each_item__3soZI">
                    <span style="text-align: right;">运费：</span>
                    <span class="confirm_value__cg79b">¥6.00</span>
                </div>
                <div>
                    <span style="text-align: right;">应付总额</span>
                    <span style="color: rgb(153, 153, 153);"></span> :
                    <span class="confirm_total_amount__1VnRvn">¥{{actually}}</span>
                </div>
            </div>
        </div>
    </div>
    <div class="confirm_submit-footer-row__kh15N">
        <div class="confirm_submit_footer_left__smetN">
            总计
            <span class="confirm_total_quantity__1SoG6">{{goodslist.length}}</span> 笔
            <el-button size="small" class="btn-box" @click="smallshow = !smallshow">收起明细
                <i v-show="!smallshow" class="el-icon-arrow-down el-icon--right"></i>
                <i v-show="smallshow" class="el-icon-arrow-up el-icon--right"></i>
            </el-button>
        </div>
        <div class="confirm_submit_footer_right__NEJqX">
            <span style="vertical-align: middle;">应付总金额
                <span style="color: rgb(153, 153, 153);"></span>
            </span>
            <span class="confirm_total_amount__1VnRv">
                <span class="confirm_currency__UyGPG">¥</span>
            <span class="confirm_amount__0DLBf">{{actually}}</span>
            </span>
            <el-button type="primary" @click="submitOrder">提交付款</el-button>
        </div>
    </div>
</div>
</div>
</div>
</div>
</div>
<homefooter></homefooter>
<el-dialog title="选择地址" :visible.sync="centerDialogVisible" width="30%" center>
    <div style="display: flex;align-items: center;justify-content: space-between;" v-for="(item,index) in shouhuolist" :key="index">
        <div style="display: flex;align-items: center;margin-bottom: 10px;">
            <div style="margin-right: 10px;">
                <el-checkbox v-model="item.radio" @change="itemboxchange(item)"></el-checkbox>
            </div>
            <div class="name-box">
                <div class="name">
                    <span>{{item.name}} {{item.phone}}</span>
                    <span class="SubmitAddress_addr_default__xpa6u" v-if="item.is_status == 1">默认</span>
                </div>
                <div style="height: 5px;"></div>
                <div class="where">
                    {{item.detail}}
                </div>
            </div>
        </div>
        <div style="text-align: right;">
            <el-button size="small" @click="editUserAddress(item.address_id)">更换</el-button>
        </div>
    </div>
    <span slot="footer" class="dialog-footer">
    <el-button @click="centerDialogVisible = false">取 消</el-button>
    <el-button type="primary" @click="changebuyer">确 定</el-button>
  </span>
</el-dialog>

<el-dialog title="编辑地址" :visible.sync="editDialogVisible" width="30%" center>
    <div style="display: flex;align-items: center;justify-content: space-between;width: 100%;">
        <el-form ref="form" :rules="rules" :model="form" label-width="100px" style="width: 100%;">
            <el-form-item label="收货人" prop="name">
                <el-input v-model="form.name"></el-input>
            </el-form-item>
            <el-form-item label="手机号" prop="phone">
                <el-input v-model="form.phone"></el-input>
            </el-form-item>
            <el-form-item label="所在地区" prop="placename">
                <el-cascader style="width: 100%;" v-model="form.placename" :options="regionData" @change="handleChange">
                </el-cascader>
            </el-form-item>
            <el-form-item label="详细地址" prop="detail">
                <el-input type="textarea" v-model="form.detail"></el-input>
            </el-form-item>
            <el-form-item label="身份证号">
                <el-input v-model="form.id_card_number"></el-input>
            </el-form-item>
            <el-form-item>
                <el-row>
                    <el-col :span="12">
                        <el-upload class="avatar-uploader" :action="imgUrl+'index.php?s=/admin/upload/image'" :headers="headers" :show-file-list="false" :auto-upload="true" name="iFile" :on-success="positiveAvatarSuccess" :on-error="err">
                            <img v-if="positiveImg" :src="positiveImg" class="avatar">
                            <img v-else src="../../assets//img/zhengmian.png" class="avatar">

                        </el-upload>
                    </el-col>
                    <el-col :span="12">
                        <el-upload class="avatar-uploader" :action="imgUrl+'index.php?s=/admin/upload/image'" :headers="headers" :show-file-list="false" :auto-upload="true" name="iFile" :on-success="backAvatarSuccess">
                            <img v-if="backImg" :src="backImg" class="avatar">
                            <img v-else src="../../assets//img/fanmian.png" class="avatar">

                        </el-upload>
                    </el-col>
                </el-row>
            </el-form-item>
            <el-form-item>
                <div>
                    <el-checkbox v-model="form.status">是否设为默认地址</el-checkbox>
                </div>
            </el-form-item>
        </el-form>
    </div>
    <span slot="footer" class="dialog-footer">
    <el-button @click="closenewAddress">取 消</el-button>
    <el-button type="primary" @click="addnewAddress('form')">确 定</el-button>
  </span>
</el-dialog>

<el-dialog title="订购人信息" :visible.sync="addDialogVisible" width="30%" center>
    <div class="ant-modal-body">
        <p class="ModalCheck_bond_info__yS">应海关文件要求：购买跨境商品需确保支付人的身份信息真实有效，并且与实际支付人一致，否则会造成退单</p>
    </div>
    <div style="display: flex;align-items: center;justify-content: space-between;width: 100%;">
        <el-form ref="form" :model="form" label-width="100px" style="width: 100%;">
            <el-form-item label="支付人姓名">
                <el-input v-model="form.name"></el-input>
            </el-form-item>
            <el-form-item label="身份证号码">
                <el-input v-model="form.name"></el-input>
            </el-form-item>
            <el-form-item>
                <div>
                    <el-checkbox v-model="checked">已阅读，同意<a style="color: #656EFE;">《免责申明》</a></el-checkbox>
                </div>
            </el-form-item>
        </el-form>
    </div>
    <span slot="footer" class="dialog-footer">
    <el-button @click="addDialogVisible = false">取 消</el-button>
    <el-button type="primary" @click="addDialogVisible = false">确 定</el-button>
  </span>
</el-dialog>


<el-dialog title="" :close-on-click-modal=false :close-on-press-escape=false :show-close=false :visible.sync="zfcenterDialogVisible" width="30%" top="35vh" center>
    <div class="pay" v-show="isShow=='3'">
        <div @click="payT=0">
            <img src="../../assets/img/wxzf.png" />
            <span :class="[payT== 0 ? 'wxzf' : '']">微信支付</span>
        </div>
        <div class="feng" v-if="commodityType"></div>
        <div @click="yePlay" v-if="commodityType">
            <img src="../../assets/img/yezf.png" />
            <span :class="[payT== 1 ? 'yezf' : '']">余额支付</span>
        </div>
    </div>
    <div style="height: 250px">
        <div v-show="isShow=='1'">
            <div class="loadingBox" v-loading="loading" element-loading-text="订单已提交，正在校验中，请等待......" element-loading-spinner="el-icon-loading">
            </div>
            <p class="tswz">预计等待5-10s</p>
        </div>

        <div class="errone" v-show="isShow=='2'">
            <p>{{infomation}}</p>
        </div>

        <div class="nowPlay" v-show="isShow=='3'">
            <div class="clonse" @click="clea"></div>
            <template v-if="payT==1 && commodityType">
      <strong style="margin-bottom: 20px">订单金额：<span class="ddje">￥{{actually}}</span></strong>
      <div>
        当前账户余额(元)：￥{{ shopInformation && shopInformation.balance}}
      </div>
      <div v-if="parseFloat(actually) > parseFloat(shopInformation.balance)">
        余额不足，请充值
      </div>
      <div class="line"></div>
      <el-button type="primary" @click="nowPlay(10)"
                 v-if="parseFloat(actually) <= parseFloat(shopInformation.balance)">立即支付
      </el-button>
    </template>
            <template v-if="payT==0 && payUrl">
      <div class="qrCode">
        <img :src="payUrl" alt=""/>
      </div>
      <div class="plasePay">请扫码支付：<span>￥</span><span>{{actually}}</span></div>
      <!--            <el-button type="success" v-if="isplay" @click="clea">确认支付</el-button>-->
      <!--            <el-button type="success" v-else disabled >确认支付</el-button>-->
    </template>
            <template v-if="isplay">
      <div class="zfcg">支付成功</div>
      <div>{{djs}}s</div>
      <div class="qsd">请稍等，正在跳转中.......</div>
    </template>

        </div>


    </div>

</el-dialog>
</div>
</template>

<script>
    var payInterval = null;
    var timeo = null;
    var djsinter = null;
    import homeTop from '../assembly/top'
    import homefooter from '../assembly/footer'
    import config from '../../config'
    import {
        regionData,
        CodeToText,
        TextToCode
    } from 'element-china-area-data'
    export default {
        components: {
            homeTop,
            homefooter
        },
        data() {
            var checkId = (rule, value, callback) => {
                if (!value) {
                    return callback(new Error('年龄不能为空'));
                }
                setTimeout(() => {
                    if (!Number.isInteger(value)) {
                        callback(new Error('请输入数字值'));
                    } else {
                        if (value < 18) {
                            callback(new Error('必须年满18岁'));
                        } else {
                            callback();
                        }
                    }
                }, 1000);
            };
            return {
                headers: {
                    token: ''
                },
                imgUrl: config.imgUrl,
                positiveImg: '', //正面
                backImg: '', //反面
                shopInformation: {},
                djs: 3,
                isplay: false,
                loading: true,
                payT: 0,
                isShow: '1',
                zfcenterDialogVisible: false,
                commodityType: true,
                payUrl: '',
                infomation: '',



                orderID: 0,
                orderprice: 0, //商品总额
                actually: 0, //应付总金额
                remark: [],
                ordervalue: '一般',
                goodslist: [],
                placeshowdata: {}, //页面回显的地址
                placename: [],
                addDialogVisible: false,
                checked: false,
                regionData: [],
                arevalue: [],
                form: {
                    name: '',
                    phone: '',
                    status: '',
                    detail: '',
                    region: [],
                    placename: [],
                    id_card_number: ''
                },
                editDialogVisible: false,
                radio: '1',
                centerDialogVisible: false,
                smallshow: false,
                textarea: '',
                radio1: '1',
                tableData: [{
                    data: '123'
                }],
                value: '',
                options: [{
                    value: '选项1',
                    label: '黄金糕'
                }, {
                    value: '选项2',
                    label: '双皮奶'
                }, {
                    value: '选项3',
                    label: '蚵仔煎'
                }, {
                    value: '选项4',
                    label: '龙须面'
                }, {
                    value: '选项5',
                    label: '北京烤鸭'
                }],
                rules: {
                    name: [{
                        required: true,
                        message: '请输入收货人名称',
                        trigger: 'blur'
                    }, {
                        min: 2,
                        max: 10,
                        message: '长度在 2 到 10 个字符',
                        trigger: 'blur'
                    }],
                    placename: [{
                        required: true,
                        message: '请选择所在地区',
                        trigger: 'blur'
                    }],
                    detail: [{
                        required: true,
                        message: '请输入详细地址',
                        trigger: 'blur'
                    }],
                    phone: [{
                        required: true,
                        message: '请输入联系电话',
                        trigger: 'blur'
                    }],
                    id_card_number: [{
                        validator: checkId,
                        trigger: 'blur'
                    }]
                },
                page: {
                    pageSize: 10,
                    page: 1
                },
                shouhuolist: [],
                total: 1,
                buyer: {},
                cart_ids: '',




                //直接下单传过来数据
                goodsparam: {},
                type: 1,
            }
        },
        watch: {


            // cityIndex() {
            //     this.twoArr = this.options[this.cityIndex].children;
            //     this.threeArr = this.options[this.cityIndex].children[this.ctiyChildrenIndex].children;
            // },
            // ctiyChildrenIndex() {
            //     this.threeArr = this.options[this.cityIndex].children[this.ctiyChildrenIndex].children;
            // },

        },
        created() {
            console.log(this.$route.query);
            if (this.$route.query.cart_ids) {
                this.type = 2
                this.cart_ids = this.$route.query.cart_ids.substring(0, this.$route.query.cart_ids.length - 1);
            } else {
                this.goodsparam = this.$route.query
                this.type = 1
                console.log(this.goodsparam);
            }
            this.regionData = regionData
            this.shouhudata()
            this.getList()
            this.getUserInfo();
            this.getToken();
        },
        methods: {
            editUserAddress(address_id) {
                this.editDialogVisible = true
                this.$HttpGet("/index.php?s=/admin/home.address/detail", {
                    address_id: address_id
                }).then(res => {
                    if (res.code == 0) {
                        // this.shopInformation = res.data
                        console.log(123);
                        this.form.name = res.data.detail.name
                        this.form.phone = res.data.detail.phone
                        this.form.id_card_back = res.data.detail.id_card_back
                        this.form.id_card_just = res.data.detail.id_card_just
                        this.form.id_card_number = res.data.detail.id_card_number
                    }

                })
            },
            err(data) {
                debugger
            },
            getToken() {
                this.headers.token = window.localStorage.getItem("token");

            },
            positiveAvatarSuccess(res, file) {
                console.log(res)
                if (res.code == 1) {
                    this.$notifyError(res.msg);
                    return false
                }
                this.positiveImg = res.data.file_path;
                this.form.id_card_just = res.data.file_path;
            },
            backAvatarSuccess(res, file) {
                console.log(res)
                if (res.code == 1) {
                    this.$notifyError(res.msg);
                    return false
                }
                this.backImg = res.data.file_path;
                this.form.id_card_back = res.data.file_path;
            },
            getUserInfo() {
                this.$HttpGet("/index.php?s=/admin/index/details").then(res => {
                    if (res.code == 0) {
                        this.shopInformation = res.data
                    }

                })
            },
            clea() {
                console.log(123);
                this.zfcenterDialogVisible = false;
                clearInterval(payInterval);
                clearInterval(djsinter);
                this.$router.push({
                    path: "/index/order/allOrder"
                })

            },
            yePlay() {
                this.payT = 1;
            },
            nowPlay(payType = 10) {

                this.$HttpPost("/index.php?s=/admin/home.order/pay", {
                    order_id: this.orderID,
                    payType: 22
                }).then(res => {
                    if (res.code != 0) {
                        this.$notifyError('请求错误');
                        setTimeout(() => {
                            window.history.back();
                        }, 1500)
                        return false
                    }
                    if (res.code == 0 && payType == 10) {
                        // this.centerDialogVisible = false;
                        this.$notifySuccess(res.msg.success);
                        this.$router.push({
                            path: `/index/order/allOrder`
                        });
                    }
                    if (res.code == 0 && payType == 20) {
                        console.log(res.data.payment, '789789');
                        this.payUrl = res.data.payment;
                        payInterval = setInterval(() => {
                            this.$HttpGet("/index.php?s=/admin/home.order/pay_wechat_status", {
                                order_id: this.orderID,
                            }).then(res => {
                                console.log(res);
                                if (res.data != '未完成支付') {
                                    this.isplay = true;

                                    this.payT = '支付成功';
                                    this.isShow = '3';

                                    djsinter = setInterval(() => {
                                        if (this.djs < 1) {
                                            clearInterval(djsinter);
                                            return false;
                                        }
                                        if (this.djs == 1) {
                                            this.isplay = true;
                                            this.$notifySuccess('支付成功');
                                            this.$router.push({
                                                path: `/index/order/allOrder`
                                            });
                                            console.log(1111)
                                        }
                                        this.djs -= 1;

                                    }, 1000)

                                }
                            })
                        }, 1000)
                    }
                })
            },
            submitOrder() {
                if (this.placeshowdata == {}) {
                    this.$notifyError('请选择收货地址或添加收货地址');
                    return false;
                }
                console.log(this.placeshowdata);
                let url = "";
                let param = {};
                if (this.type == 1) {
                    url = "/index.php?s=/admin/home.order/buyNow";
                    param = {
                        goods_id: this.goodsparam.goods_id,
                        goods_num: this.goodsparam.goods_num,
                        goods_sku_id: this.goodsparam.goods_sku_id,
                        address_id: this.placeshowdata.address_id
                    };

                } else {
                    url = `/index.php?s=/admin/home.order/cart`;
                    param = {
                        remark: this.remark,
                        pay_type: 30,
                        cart_ids: this.cart_ids,
                        address_id: this.placeshowdata.address_id
                    }
                }
                this.$HttpPost(url, param).then(res => {
                    console.log(res);
                    if (res.code == 0) {
                        this.orderID = res.data.order_id;
                        this.$HttpGet("/index.php?s=/admin/home.order/pay_source", {
                            order_no: res.data.order_no
                        }).then((res) => {
                            if (res.code != 0) {
                                this.$notifyError('请求错误');
                                setTimeout(() => {
                                    window.history.back();
                                }, 1500)
                                return false
                            }
                            this.zfcenterDialogVisible = true
                            if (res.data.status_pay) {
                                if (res.data.source_info.code == 0) {
                                    this.isShow = 3;
                                    this.nowPlay(20)
                                } else if (res.data.source_info.code == -1) {
                                    console.log(2);
                                } else {
                                    console.log(3);
                                }
                            } else {
                                if (res.data.source_info) {
                                    this.$notifyError('订单校验失败，' + res.data.source_info.msg);
                                } else {
                                    this.$notifyError('订单校验失败，请重新选择商品');
                                }
                            }
                        })
                    }
                })
            },
            getList() {
                let url = "";
                let param = {};
                if (this.type == 1) {
                    url = "/index.php?s=/admin/home.order/buyNow";
                    param = {
                        goods_id: this.goodsparam.goods_id,
                        goods_num: this.goodsparam.goods_num,
                        goods_sku_id: this.goodsparam.goods_sku_id,
                        address_id: this.placeshowdata.address_id
                    };

                } else {
                    url = `/index.php?s=/admin/home.order/cart`;
                    param = {
                        pay_type: 30,
                        cart_ids: this.cart_ids,
                        address_id: this.placeshowdata.address_id
                    }
                }
                this.$HttpGet(url, param).then(res => {
                    console.log(res);
                    this.orderprice = res.data.order_price
                    this.actually = res.data.order_pay_price;
                    this.goodslist = res.data.goods_list
                    console.log(this.goodslist, '7777');
                    for (const a of this.goodslist) {
                        if (a.trade_type_name == '保税') {
                            this.ordervalue = '保税'
                        } else {
                            this.ordervalue = '一般'
                        }
                    }
                })
            },
            changebuyer() {
                this.placeshowdata = this.buyer
                this.centerDialogVisible = false
            },
            replace() {
                this.buyer = {}
                this.centerDialogVisible = true
                for (const a of this.shouhuolist) {
                    if (this.placeshowdata.address_id == a.address_id) {
                        a.radio = true
                    } else {
                        a.radio = false
                    }
                }
            },
            itemboxchange(item) {
                this.buyer = item
                console.log(item);
                item.radio = true
                for (const a of this.shouhuolist) {
                    if (a.address_id == item.address_id) {
                        a.radio = true
                    } else {
                        a.radio = false
                    }
                }
            },
            shouhudata() {
                this.$HttpPost("/index.php?s=/admin/home.address/lists", this.page).then(res => {
                    console.log(res);
                    var arr = []
                    arr = res.data.list.data
                    for (const a of arr) {
                        if (a.is_status == 1) {
                            a.radio = true
                            this.placeshowdata = a
                        } else {
                            a.radio = false
                        }
                    }
                    this.shouhuolist = [...res.data.list.data]
                    console.log(this.shouhuolist);
                    this.total = res.data.list.total
                })
            },
            handleChange(e) {
                this.form.region = []
                console.log(this.regionData);
                console.log(e);
                for (const a of this.regionData) {
                    console.log(e[0]);
                    if (e[0] == a.value) {
                        this.form.region.push(a.label)
                        for (const b of a.children) {
                            if (e[1] == b.value) {
                                this.form.region.push(b.label)
                                for (const c of b.children) {
                                    if (e[2] == c.value) {
                                        this.form.region.push(c.label)
                                        console.log(this.form.region);
                                    }
                                }
                            }
                        }
                    }
                }
            },
            goNext() {
                var text = '保税1'
                if (text == '保税') {
                    this.addDialogVisible = true
                } else {
                    this.$router.push('/index/payment')
                }
            },
            closenewAddress() {
                this.editDialogVisible = false
                this.form.name = ''
                this.form.placename = []
                this.form.detail = ''
                this.form.phone = ''
                this.form.region = []
            },
            addnewAddress(form) {
                console.log(this.$refs[form]);
                this.$refs[form].validate((valid) => {
                    if (valid) {
                        console.log(123);
                        this.$HttpPost("/index.php?s=/admin/home.address/add", this.form).then(res => {
                            console.log(res);
                            if (res.code == 0) {
                                this.$notify({
                                    title: '成功',
                                    message: res.msg,
                                    type: 'success'
                                });
                                this.closenewAddress()
                                this.shouhudata()
                            }
                        })
                    }

                })


            }
        }
    }
</script>

<style lang="scss" scoped>
    .mall-layout {
        position: relative;
        width: 100%;
        background-color: #fff !important;
    }
    
    .mall-layout-main {
        min-height: calc(100vh - 200px);
        margin: 0 auto;
        padding-top: 24px;
        /* background-color: #fff !important; */
    }
    
    .ant-spin-nested-loading {
        position: relative;
    }
    
    .ant-spin-container {
        position: relative;
        -webkit-transition: opacity 0.3s;
        transition: opacity 0.3s;
    }
    
    .confirm_order-confirm-page__PAhG7 {
        width: 1280px;
        margin: 0 auto;
        padding-bottom: 80px;
        overflow: hidden;
        color: #333;
        font-size: 12px;
    }
    
    .SubmitAddress_submit_addr__NQKkZ {
        display: flex;
        -ms-flex-align: center;
        align-items: center;
        -ms-flex-pack: justify;
        justify-content: space-between;
        height: 80px;
        margin-bottom: 20px;
        padding: 0 20px 0 17px;
        border: 1px solid #EEEEEE;
        border-radius: 8px;
    }
    
    .SubmitAddress_addr_left__l7qgs {
        display: flex;
        -ms-flex-align: center;
        align-items: center;
        color: #333;
        font-size: 14px;
    }
    
    .SubmitAddress_addr_info_comp__k17v1 {
        display: flex;
        -ms-flex-direction: column;
        flex-direction: column;
        color: #333;
    }
    
    .SubmitAddress_account__KL7hv {
        font-weight: 600;
    }
    
    .SubmitAddress_addr__Mo6Ye {
        color: #666;
        font-size: 12px;
    }
    
    .SubmitAddress_addr_right__f1-op {}
    
    .confirm_goods-table-component__xVuWN {
        overflow: hidden;
        border: 1px solid #eee;
        border-radius: 8px;
    }
    
    .confirm_table_component_m15__LbmRD {
        margin: 15px 0;
    }
    
    .ant-table {
        border-radius: 8px;
    }
    
    .ant-table-title {
        padding: 12px 20px;
        border-radius: 2px 2px 0 0;
    }
    
    .confirm_header-component__prQfL {
        display: flex;
        -ms-flex-pack: justify;
        justify-content: space-between;
        width: 100%;
        font-size: 12px;
    }
    
    .ant-space-align-center {
        gap: 8px;
        align-items: center;
        display: inline-flex;
    }
    
    .ant-space-item {}
    
    .confirm_store-name__ZVLve {
        color: #999;
    }
    
    .ant-space-item-split {}
    
    .ant-divider {
        box-sizing: border-box;
        margin: 0;
        padding: 0;
        color: rgba(0, 0, 0, 0.85);
        font-size: 14px;
        font-variant: tabular-nums;
        line-height: 1.5715;
        list-style: none;
        -webkit-font-feature-settings: 'tnum', "tnum";
        font-feature-settings: 'tnum', "tnum";
    }
    
    .ant-divider-vertical {
        osition: relative;
        top: -0.06em;
        display: inline-block;
        height: 0.9em;
        margin: 0 8px;
        vertical-align: middle;
        border-top: 0;
        border-left: 1px solid rgba(0, 0, 0, 0.06);
    }
    
    .confirm_order-number__o2fkS {
        color: #333;
    }
    
    .text-name {
        font-size: 13px;
        display: flex;
        align-items: center;
        justify-content: center;
        flex: 1;
    }
    
    .ant-table-container {
        padding: 0 20px;
    }
    
    /deep/.el-table th,
    .el-table tr {
        font-size: 12px;
        background-color: rgb(247, 248, 250);
    }
    
    /deep/.el-table th>.cell {
        display: flex;
        justify-content: center;
    }
    
    .confirm_goods-item-wrapper__DSo8 {
        display: flex;
    }
    
    .ant-image {
        position: relative;
        display: inline-block;
        width: 84px;
        height: 84px;
    }
    
    .confirm_goods-info__2vuNd {
        display: flex;
        -ms-flex-direction: column;
        flex-direction: column;
        -ms-flex-align: start;
        align-items: flex-start;
        -ms-flex-pack: justify;
        justify-content: space-between;
        margin-left: 15px;
        color: #999;
        font-size: 12px;
    }
    
    .confirm_title__8CPeb {
        color: #333;
        font-weight: 600;
        text-align: left;
    }
    
    .confirm_goods_prop__bm349 {
        text-align: left;
    }
    
    .ant-tag {
        color: #656efe;
        font-size: 12px;
        border: none;
        border-color: #f5fafd;
        background-color: #fafafa;
    }
    
    .scope-item {
        display: flex;
        justify-content: center;
        align-items: center;
        color: #333;
    }
    
    .ant-table-footer {
        border-radius: 0 0 2px 2px;
        padding: 0;
        background-color: #fff;
    }
    
    .confirm_footer-component__GqfXh {
        display: flex;
        -ms-flex-align: center;
        align-items: center;
        -ms-flex-pack: justify;
        justify-content: space-between;
        padding: 16px 20px;
        color: #666;
        font-size: 12px;
        background-color: #fff;
        justify-content: flex-end;
    }
    
    .confirm_table_footer_price__Qnj8h {
        gap: 20px;
        justify-content: flex-end;
        font-weight: 600;
        font-size: 16px;
        align-items: center;
        /* color: #666; */
    }
    
    .small-box {
        display: flex;
        align-items: center;
    }
    
    .ant-images {
        width: 16px;
        height: 16px;
        position: relative;
        display: inline-block;
        padding-bottom: 8px;
    }
    
    .Price_price-component__RzPDf {
        margin-left: 8px;
        gap: 8px;
        align-items: center;
        display: inline-flex;
        font-weight: 600;
        font-size: 16px;
    }
    
    .ant-space-item {}
    
    .Price_title-0__9N801 {
        font-size: 14px;
    }
    
    .confirm_price-count__fuGOm {
        color: #f44;
    }
    
    .confirm_footer-opt__r7Ttc {
        display: flex;
        -ms-flex-direction: column;
        flex-direction: column;
        -ms-flex-pack: end;
        justify-content: flex-end;
        padding: 0 20px;
        background-color: #f5fafd;
    }
    
    .confirm_footer-item__SAVfY {
        display: flex;
        -ms-flex-pack: end;
        justify-content: flex-end;
        padding: 12px 0;
    }
    
    .confirm_item-info__6Iagv {
        display: flex;
        -ms-flex-align: center;
        align-items: center;
    }
    
    .confirm_item-text__y6e {
        color: #666;
        font-size: 12px;
    }
    
    .select-box {
        min-width: 172px;
        max-height: 172px;
    }
    
    .confirm_footer-middle-line__x67lJ {
        height: 1px;
        background-color: #eee;
    }
    
    .confirm_footer-pay-type__0hVcG {
        display: flex;
        -ms-flex-align: center;
        align-items: center;
        -ms-flex-pack: end;
        justify-content: flex-end;
        margin-left: 24px;
        padding: 12px 0;
    }
    
    .confirm_type-pay__UGf0R {
        display: flex;
        -ms-flex-align: center;
        align-items: center;
    }
    
    .confirm_type-text__P4v1e {
        color: #666;
        font-size: 12px;
    }
    
    /deep/.el-radio {
        margin-right: 0;
    }
    
    .confirm_type-limit__OFskU {
        width: 100px;
        margin-left: 60px;
        text-align: right;
    }
    
    .confirm_type-text__P4v1e {
        color: #666;
        font-size: 12px;
    }
    
    .confirm_type-price__ {
        color: #666;
        font-weight: 500;
        font-size: 14px;
    }
    
    .confirm_submit-footer__r5 {
        margin-top: 40px;
    }
    
    .confirm_submit-footer-row__kh15N {
        display: flex;
        -ms-flex-align: center;
        align-items: center;
        -ms-flex-pack: justify;
        justify-content: space-between;
        width: 1270px;
        height: 64px;
        margin: 0 auto;
        padding: 0 10px 0 20px;
        font-size: 14px;
        background-color: #fff;
        border-radius: 4px;
        -webkit-box-shadow: 0 1px 14px 0 rgba(29, 36, 70, 0.08);
        box-shadow: 0 1px 14px 0 rgba(29, 36, 70, 0.08);
    }
    
    .confirm_submit_footer_left__smetN {}
    
    .confirm_total_quantity__1SoG6 {
        color: #f44;
    }
    /* /deep/.el-button {
        border: 0;
    } */
    
    .confirm_submit_footer_right__NEJqX {
        font-size: 12px;
        margin-right: 15px;
    }
    
    .confirm_total_amount__1VnRv {
        margin-left: 10px;
        color: #f44;
        font-weight: 600;
    }
    
    .confirm_currency__UyGPG {
        margin-right: 4px;
        font-weight: bold;
        font-size: 14px;
        vertical-align: middle;
    }
    
    .confirm_amount__0DLBf {
        font-size: 25px;
        vertical-align: sub;
    }
    
    /deep/.el-button--primary {
        margin-left: 40px;
    }
    
    .confirm_submit_footer_hide__08sRD {
        display: flex;
        -ms-flex-direction: column;
        flex-direction: column;
        -ms-flex-align: end;
        align-items: flex-end;
        -ms-flex-pack: center;
        justify-content: center;
        padding: 0 20px;
        background: #f7f8fa;
        border-radius: 6px 6px 0 0;
    }
    
    .confirm_hide_content__bPyfY {
        margin: 7.5px 0;
        color: #666;
        font-size: 12px;
        display: flex;
        -ms-flex-pack: justify;
        justify-content: space-between;
        width: 100%;
    }
    
    .confirm_total_count__XCqr7 {
        color: #666
    }
    
    .confirm_total_title__fyXu4 {
        margin-right: 20px;
        color: #333;
        font-weight: 500;
        font-size: 14px;
    }
    
    .confirm_each_item__3soZI {
        margin-bottom: 10px;
    }
    
    .confirm_value__cg79b {
        display: inline-block;
        width: 130px;
        color: #333;
        font-weight: 600;
        font-size: 14px;
    }
    
    .confirm_total_amount__1VnRvn {
        display: inline-block;
        width: 130px;
        color: #f44;
        font-weight: 600;
        font-size: 18px;
    }
    
    .btn-box {
        border: 0;
    }
    
    .name-box {
        display: flex;
        flex-direction: column;
    }
    
    .name {
        font-size: 14px;
        font-weight: 700;
    }
    
    .SubmitAddress_addr_default__xpa6u {
        margin-left: 10px;
        padding: 2px 10px;
        color: #656EFE;
        font-size: 12px;
        background-color: #EBEDFF;
        border-radius: 4px;
    }
    
    .where {
        color: #666;
        font-size: 12px;
    }
    
    /deep/.el-dialog--center .el-dialog__body {
        height: 300px;
        overflow: auto;
    }
    
    .ant-modal-body {
        /* min-height: 180px; */
        padding: 0;
        font-size: 14px;
        line-height: 1.5715;
        word-wrap: break-word;
    }
    
    .ModalCheck_bond_info__yS {
        padding: 5px 20px;
        color: #fdb13c;
        background-color: #fef6e9;
        margin-bottom: 1em;
    }
    
    /deep/ .el-dialog {
        min-width: 550px;
        border-radius: 20px;
        .pay {
            position: relative;
            width: 220px;
            height: 50px;
            display: flex;
            justify-content: space-between;
            cursor: pointer;
            top: -27px;
            div {
                &:first-child:hover {
                    color: #2CCE30;
                }
                &:last-child:hover {
                    color: #3958ac;
                }
                img {
                    width: 25px;
                    height: 22px;
                    margin-top: -5px;
                }
                span {
                    margin-left: 5px;
                }
                .wxzf {
                    color: #09BB07;
                }
                .yezf {
                    color: #3958AC;
                }
            }
            .feng {
                height: 20px;
                background: #333333;
                border-right: solid #333333 2px;
            }
        }
    }
    
    .nowPlay {
        position: relative;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        .ddje {
            font-size: 24px;
            font-family: PingFang SC;
            font-weight: bold;
            color: #E93030;
        }
        .plasePay {
            span {
                font-size: 24px;
                color: #E93030;
                /*&:first-child{*/
                /*  font-size: 16px;*/
                /*  color: #E93030;*/
                /*}*/
            }
        }
        .zfcg {
            color: #E93030;
            font-size: 26px;
            font-weight: bold;
        }
        .qsd {
            font-size: 14px;
            color: #333333;
        }
        .qrCode {
            width: 150px;
            height: 150px;
            cursor: pointer;
            img {
                width: 100%;
                height: 100%;
            }
        }
        .clonse {
            width: 16px;
            height: 16px;
            position: absolute;
            top: -76px;
            right: -10px;
            cursor: pointer;
            background: url("../../assets/img/del.png") no-repeat;
        }
        .line {
            width: 80%;
            height: 1px;
            border-top: dashed #ACC0D8 1px;
        }
        div {
            margin-bottom: 20px;
        }
    }
    
    .avatar-uploader .el-upload {
        border: 1px dashed #d9d9d9;
        border-radius: 6px;
        cursor: pointer;
        position: relative;
        overflow: hidden;
    }
    
    .avatar-uploader .el-upload:hover {
        border-color: #409EFF;
    }
    
    .avatar-uploader-icon {
        font-size: 28px;
        color: #8c939d;
        width: 178px;
        height: 178px;
        line-height: 178px;
        text-align: center;
    }
    
    .avatar {
        width: 195px;
        height: auto;
        display: block;
    }
    
    .img {
        width: 36px;
        height: 36px;
        background: url("../../assets/img/index/morendizhi.png");
        position: absolute;
        top: 0px;
        right: 0px;
    }
</style>